import React, { Component } from 'react'
import 'antd/dist/antd.css';  
import './header.css';
import {Layout,Row, Col,Avatar,Popover, Button,Image} from 'antd';

import axios from 'axios';


export default class AdminHeader extends Component {
    
    
    render() {
        const content = (
            <div>
                <Button type="link" onClick={() =>{
                    //请求注销接口
                    axios.post('/logout').then((res)=>{this.props.history.push('/login')})
                }} danger>注销</Button>
            </div>
        )
        return (
         
            <header className="header">
                <Row>
                    <Col span={16} className="left">
                        后台管理系统
                    </Col>
                    <Col span={8} className="right">
                    <Popover content={content}>
                    <Avatar className="avater" size={50}  src={<Image src="https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=1717609176,499444941&fm=26&gp=0.jpg" />} />
                    </Popover>    
                    </Col>
                </Row>
            </header>
        )
    }
}